import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../../widget/scroll_page_view.dart';
import 'community_info_controller.dart';

class CommunityInfoPage extends StatelessWidget {
  const CommunityInfoPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GetBuilder(
        init: CommunityInfoController(),
        builder: (controller) => Scaffold(
              body: CustomScrollView(
                slivers: [
                  SliverAppBar(
                    toolbarHeight: 88.h,
                    expandedHeight: 396.h,
                    backgroundColor: Colors.transparent,
                    elevation: 0,
                    leading: IconButton(
                      icon: Icon(
                        Icons.arrow_back_ios_new_outlined,
                        color: Colors.white,
                        size: 36.w,
                      ),
                      onPressed: () => Get.back(),
                    ),
                    title: Text(
                      "详情",
                      style: TextStyle(
                        fontSize: 36.sp,
                        color: Colors.white,
                      ),
                    ),
                    centerTitle: true,
                    flexibleSpace: _builderFlexibleSpaceWidget(controller),
                  ),
                  SliverToBoxAdapter(
                    child: _builderContentWidget(controller),
                  ),
                  SliverToBoxAdapter(
                    child: _builderBottomWidget(controller),
                  ),
                ],
              ),
            ));
  }

  Widget _builderFlexibleSpaceWidget(CommunityInfoController controller) {
    return FlexibleSpaceBar(
      background: Stack(
        alignment: Alignment.bottomCenter,
        children: [
          _builderBannerWidget(controller),
          Container(
            height: 88.h,
            margin: EdgeInsets.symmetric(horizontal: 32.w),
            padding: EdgeInsets.symmetric(horizontal: 24.w),
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8.w), color: Colors.white),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Icon(
                  Icons.watch_later,
                  size: 32.w,
                  color: const Color(0xFF1774e0),
                ),
                Padding(
                  padding: EdgeInsets.only(left: 8.w),
                  child: Text(
                    "发布时间: ",
                    style: TextStyle(
                        fontSize: 28.sp, color: const Color(0xFF333333)),
                  ),
                ),
                Padding(
                  padding: EdgeInsets.only(left: 8.h, top: 2.h),
                  child: Obx(() => Text(
                        controller.publishTime.value,
                        style: TextStyle(
                            fontSize: 28.sp, color: const Color(0xFF333333)),
                      )),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }

  Widget _builderBannerWidget(CommunityInfoController controller) {
    return Obx(() => Container(
          height: 440.h,
          margin: EdgeInsets.only(bottom: 44.h),
          child: controller.banners.isEmpty
              ? Container()
              : ScrollPageView(
                  onPageChanged: (index) =>
                      controller.bannerIndex.value = index,
                  indicatorColor: const Color(0xFFFFFFFF).withOpacity(0.6),
                  checkedIndicatorColor:
                      const Color(0xFF6D6D6D).withOpacity(0.6),
                  indicatorRadius: 12.h,
                  indicatorPadding: EdgeInsets.all(60.w),
                  children: _builderBannerItems(controller),
                ),
        ));
  }

  List<Widget> _builderBannerItems(CommunityInfoController controller) {
    return controller.banners
        .map(
          (url) => Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: NetworkImage(url),
                fit: BoxFit.fill,
              ),
            ),
            width: double.maxFinite,
          ),
        )
        .toList();
  }

  Widget _builderContentWidget(CommunityInfoController controller) {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 32.w, vertical: 16.h),
      padding:
          EdgeInsets.only(left: 24.w, top: 40.h, right: 24.w, bottom: 48.h),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8.w),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Obx(() => Text(
                controller.title.value,
                style: TextStyle(
                  fontSize: 32.sp,
                  color: const Color(0xFF333333),
                  fontWeight: FontWeight.bold,
                ),
              )),
          Container(
            margin: EdgeInsets.only(top: 32.h),
            child: Text(
              _getDescTitle(controller.serviceType),
              style: TextStyle(
                fontSize: 28.sp,
                color: const Color(0xFF333333),
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: 6.h),
            child: Obx(() => Text(
                  controller.desc.value,
                  style: TextStyle(
                      fontSize: 24.sp, color: const Color(0XFF333333)),
                )),
          )
        ],
      ),
    );
  }

  Widget _builderBottomWidget(CommunityInfoController controller) {
    return Container(
      height: 160.h,
      margin: EdgeInsets.symmetric(horizontal: 32.w),
      padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 38.h),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8.w),
      ),
      child: Stack(
        children: [
          Positioned(
            left: 0,
            top: 0,
            child: Text(
              _getPhoneTitle(controller.serviceType),
              style: TextStyle(
                fontSize: 32.sp,
                color: const Color(0xFF333333),
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
          Positioned(
            right: 0,
            width: 80.w,
            height: 80.w,
            child: Container(
              decoration: BoxDecoration(
                gradient: LinearGradient(colors: [
                  const Color(0xFFF2FAFF).withOpacity(0.55),
                  const Color(0XFFB7DDFF).withOpacity(0.55),
                ]),
                shape: BoxShape.circle,
              ),
              child: IconButton(
                onPressed: () => controller.performClickCallPhone(),
                icon: Icon(
                  Icons.phone,
                  size: 40.w,
                  color: const Color(0xFF1774E0),
                ),
              ),
            ),
          )
        ],
      ),
      // child:,
    );
  }

  String _getDescTitle(int serviceType) {
    if (serviceType == 1) {
      return '房屋详情';
    }

    if (serviceType == 2) {
      return '家政详情';
    }

    if (serviceType == 3) {
      return '机票详情';
    }

    if (serviceType == 4) {
      return '机动车代理详情';
    }

    return '详情';
  }

  String _getPhoneTitle(int serviceType) {
    if (serviceType == 1) {
      return '致电房东了解更多信息';
    }

    return "致电了解更多信息";
  }
}
